import React, {useEffect} from "react";
import {observable, action} from "mobx";
import {observer} from "mobx-react";
import {useSelector} from "react-redux";

// 创建一个容器
class Store {
    // 公共状态
    @observable
    num = 10;

    // 修改公共状态的方法
    @action
    change() {
        this.num++
    }
}

let store = new Store

// 类组件
// @observer
// class Demo extends React.Component {
//     render() {
//         return <div>
//             <span>{store.num}</span>
//             <br/>
//             <button onClick={() => {
//                 store.change(this)
//             }}>按钮
//             </button>
//         </div>
//     }
// }

// // 函数组件
const Demo = observer(function () {
    return <div>
        <span>{store.num}</span>
        <br/>
        <button onClick={() => {
            store.change()
        }}>按钮
        </button>
    </div>
})

export default Demo
